//动画,狼跑
import * as THREE from "../node_modules/three/build/three.module.js";
import { GLTFLoader } from "../node_modules/three/examples/jsm/loaders/GLTFLoader";
import { OrbitControls } from "../node_modules/three/examples/jsm/controls/OrbitControls.js";
import Stats from "../node_modules/three/examples/jsm/libs/stats.module.js";

var scene, camera, light, renderer, loader, controls;
var model, skeleton;
var mixer,
  mixers = [], //播放器集,用来切换动画
  clips,
  idleAction,
  walkAction,
  runAction,
  actions,
  clock,
  stats,
  animations;

function init() {
  //场景
  scene = new THREE.Scene();
  scene.background = new THREE.Color(0x2c3e50);

  //相机
  camera = new THREE.PerspectiveCamera(
    75,
    window.innerWidth / window.innerHeight,
    0.1,
    100
  );
  camera.position.set(0.993, 1.914, 2.248);
  scene.add(camera);

  //渲染器
  renderer = new THREE.WebGLRenderer({ antialias: true });
  renderer.setSize(window.innerWidth, window.innerHeight);
  document.body.appendChild(renderer.domElement);

  //控制器
  controls = new OrbitControls(camera, renderer.domElement);
  controls.target = new THREE.Vector3(0.818, 1.314, 0.263);
  controls.update();

  //环境光
  var light = new THREE.AmbientLight(0xffffff, 8);
  scene.add(light);
  //点光源
  // var light2 = new THREE.PointLight(0xffffff, 8, 1, 100);
  // light2.position.set(-10, 10, 0);
  // scene.add(light2);

  //动画用
  clock = new THREE.Clock();

  //加载模型
  loader = new GLTFLoader();
  loader.load(
    "../src/models/wolf/scene.gltf",

    //加载完成后
    function (gltf) {
      //Mesh
      model = gltf.scene;
      scene.add(model);
      model.translateY(1);

      model.traverse(function (object) {
        //狼,产生阴影
        if (object.isMesh) {
          object.castShadow = true;
          //设置地板材质,模型只能设置bassic材质
          if (object.type == "Mesh") {
            object.material = new THREE.MeshBasicMaterial({
              color: 0x9b59b6,
            });
          }
        }
      });

      //骨架
      // skeleton = new THREE.SkeletonHelper(model);
      // skeleton.visible = true;
      // scene.add(skeleton);

      //动画
      mixer = new THREE.AnimationMixer(model.children[0]); //选取狼
      //提取模型里的动画
      animations = gltf.animations;
      console.log("动画集", animations);
      // mixer.clipAction(animations[0]).setDuration(3).play();//3秒完成一次动画

      render();
    },
    //加载中
    undefined,
    //加载失败
    function (error) {
      console.log(error);
    }
  );
}

function render() {
  requestAnimationFrame(render);

  var delta = clock.getDelta();
  mixer.update(delta);
  //0run,1walk,2creep,3idle,4site
  mixer.clipAction(animations[4]).play();
  renderer.render(scene, camera);
}

function reference() {
  //参考系
  var material1 = new THREE.LineBasicMaterial({ color: 0xd63031 }); //红
  var material2 = new THREE.LineBasicMaterial({ color: 0x55efc4 }); //绿
  var material3 = new THREE.LineBasicMaterial({ color: 0x0984e3 }); //蓝
  var geometry1 = new THREE.Geometry();
  var geometry2 = new THREE.Geometry();
  var geometry3 = new THREE.Geometry();
  let l = 90000000000
  geometry1.vertices.push(new THREE.Vector3(0, 0, 0));
  geometry2.vertices.push(new THREE.Vector3(0, 0, 0));
  geometry3.vertices.push(new THREE.Vector3(0, 0, 0));
  geometry1.vertices.push(new THREE.Vector3(l, 0, 0));
  geometry2.vertices.push(new THREE.Vector3(0, l, 0));
  geometry3.vertices.push(new THREE.Vector3(0, 0, l));
  var line1 = new THREE.Line(geometry1, material1);
  var line2 = new THREE.Line(geometry2, material2);
  var line3 = new THREE.Line(geometry3, material3);
  scene.add(line1);
  scene.add(line2);
  scene.add(line3);
}

init();
reference();
render();

//输出camera位置信息,平移相机,设置方块显示位置
// document.querySelector("canvas").onclick = function () {
//   console.log("controls.target", controls.target);
//   console.log("camera.position", camera.position);
// };
